<template>
    <!-- <div style="margin-top: 20px;margin-left: 50px;display: flex; ">
        <el-button type="primary" @click="跳按钮" class="" round>打开关联文件</el-button>
        <h3 style="margin-left: 20px;">当前关联文件路径 : {{ 文件路径 }}</h3>
    </div> -->
    <div style="display: flex; margin-top: 20px;margin-left: 20px; ">
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('按钮')">按钮</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('输入框')">输入框</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('开关')">开关</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('单选框')">单选框</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('多选框')">多选框</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('多选框组')">多选框组</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('链接')">链接</el-button>
    </div>
    <div style="display: flex; margin-top: 20px;margin-left: 20px; ">
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('选择器')">下拉选择器</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('级联选择器')">级联选择器</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('颜色选择器')">颜色选择器</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('日期选择器')">日期选择器</el-button>
    </div>
    <div style="display: flex; margin-top: 20px;margin-left: 20px; ">
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('滚动条')">滚动条</el-button>
    </div>
    <div style="display: flex; margin-top: 20px;margin-left: 20px; ">
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('表格')">表格</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('表格列')">表格列</el-button>

    </div>
    <div style="display: flex; margin-top: 20px;margin-left: 20px; ">
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('对话框')">对话框</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('消息提示')">消息提示</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('抽屉')">抽屉</el-button>
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('消息弹框')">消息弹框</el-button>
    </div>
    <div style="display: flex; margin-top: 20px;margin-left: 20px; ">
        <el-button :auto-insert-space=true :round=true type='primary' @click="跳按钮('标签页')">标签页</el-button>
        <!-- {1} -->
    </div>
</template>
<script setup>

import { ref, reactive, getCurrentInstance } from 'vue'
const { proxy } = getCurrentInstance();
const 路由 = proxy.router
const 库 = proxy.lib
const 文件路径 = ref("")
const 跳按钮 = (组件) => {
    if (组件 == "按钮") {
        路由.push({
            name: "button"
        })
    } else if (组件 == "链接") {
        路由.push({
            name: "link"
        })
    } else if (组件 == "滚动条") {
        路由.push({
            name: "scrollbar"
        })
    } else if (组件 == "级联选择器") {
        路由.push({
            name: "cascader"
        })
    } else if (组件 == "多选框") {
        路由.push({
            name: "checkbox"
        })
    } else if (组件 == "多选框组") {
        路由.push({
            name: "CheckboxGroup"
        })
    } else if (组件 == "颜色选择器") {
        路由.push({
            name: "colorPicker"
        })
    } else if (组件 == "日期选择器") {
        路由.push({
            name: "DatePicker"
        })
    } else if (组件 == "输入框") {
        路由.push({
            name: "input"
        })
    } else if (组件 == "单选框") {
        路由.push({
            name: "radio"
        })
    } else if (组件 == "选择器") {
        路由.push({
            name: "select"
        })
    } else if (组件 == "开关") {
        路由.push({
            name: "switch"
        })
    } else if (组件 == "表格") {
        路由.push({
            name: "table"
        })
    } else if (组件 == "表格列") {
        路由.push({
            name: "tablecolumn"
        })
    } else if (组件 == "对话框") {
        路由.push({
            name: "dialog"
        })
    } else if (组件 == "消息提示") {
        路由.push({
            name: "message"
        })
    } else if (组件 == "抽屉") {
        路由.push({
            name: "drawer"
        })
    } else if (组件 == "消息弹框") {
        路由.push({
            name: "messagebox"
        })
    } else if (组件 == "标签页") {
        路由.push({
            name: "tabs"
        })
    }//{1}

}


</script>
<style lang="scss"  scoped></style>